import React from 'react';
import ReactDOM from 'react-dom';

import {
  createHashHistory
} from 'History';

import {
  Router,
  Route,
  useRouterHistory
} from 'react-router'

import {
  syncHistoryWithStore,
  RouterStore
} from 'mobx-react-router';

import {
  Provider
} from 'mobx-react';

import Hrm from 'weaHrmScAirportAddressBook' //umd

const routing = new RouterStore();

const allStore = {
  routing,
  ...Hrm.store,
}

const HrmRoute = Hrm.Route;

const browserHistory = useRouterHistory(createHashHistory)({
  queryKey: '_key',
  basename: '/'
});

const history = syncHistoryWithStore(browserHistory, allStore.routing);

const Home = props => props.children;

const Root = () => (
  <Provider {...allStore}>
    <Router history={history}>
      <Route name="main" breadcrumbName="入口" path="" component={Home}>
        { HrmRoute }
      </Route>
    </Router>
  </Provider>
);

ReactDOM.render(<Root/>, document.getElementById('container'));